<template>
	<view class="beforeOrder">
		<view class="part" >
			<view class="address" v-if='address.addressId' @tap='selAdd'>
				<view class="bigAdd dFlex jStart_aCenter">
					<view class="moren" v-if="address.is_default == '2'">默认</view>
					<text>{{address.area}}</text>
				</view>
				<view class="smallAdd">{{address.address}}</view>
				<view class="user">
					<text>{{address.trueName}}</text>
					<text>{{address.tel}}</text>
				</view>
			</view>
			<view class='address' v-else @tap='selAdd'>请选择地址</view>
			<!-- <view class="appoint dFlex jBetween_aCenter">
				<view class="time" @tap='selTime("time5",5)'>
					{{time?time:'预约时间'}}
				</view>
			</view> -->
		</view>
		<view class="shops">
			<view class="shopOne dFlex jStart_aCenter" v-for="(item,index) in shopList" :key='index'>
				<view class="shopImg imgPublic">
					<image :src="item.list_img" mode="widthFix"></image>
				</view>
				<view class="info">
					<view class="shopName">{{item.product_name}}</view>
					<view class="sku dFlex jBetween_aCenter">
						<view class="price" v-if='is_vip==1'><text>{{item.sell_price}}</text>元</view>
						<view class="price" v-if='is_vip==2'><text>{{item.point}}</text>积分</view>
						<span>规格：{{item.specs_name}}</span>
					</view>
					<!-- <view class="vip">VIP价格：{{item.vip_price}}</view> -->
					<view class="other dFlex jBetween_aCenter">
						<view class="price"></view>
						<view class="count dFlex jEnd_aCenter">
							<view class='smallBtn imgPublic' @tap='jian(index)'>
								<image src='https://wx.gdxixiashi.com/public/images/car/jian.png' mode='widthFix'></image>
							</view>
							<view class='smallIpt'>
								<input type="number" v-model='item.num' min='1' @input="setCount($event,index)">
							</view>
							<view class='smallBtn imgPublic' @tap='jia(index)'>
								<image src='https://wx.gdxixiashi.com/public/images/car/jia.png' mode='widthFix'></image>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="part">
			
			<view class="line dFlex jBetween_aCenter" >
				<view class="lineTit">送货方式</view>
				<view class="lineVal dFlex jEnd_aCenter" @tap='change_sel(1)'>
					<view class="showVal">{{cleanWay}}</view>
					<view class="rightIcon imgPublic">
						<image src="../static/images/rightIcon.png" mode="widthFix"></image>
					</view>
				</view>
			</view>
			
			<view class="line dFlex jBetween_aCenter">
				<view class="lineTit">备注：</view>
				<view class="lineVal dFlex jEnd_aCenter">
					<view class="showVal">
						<input type="text" v-model='leave_word' placeholder="请输入备注">
					</view>
					<view class="rightIcon imgPublic">
						<image src="../static/images/rightIcon.png" mode="widthFix"></image>
					</view>
				</view>
			</view>
		</view>
		
		<view class="tips">{{order_content}}</view>
		<view class="total dFlex flexDirection jCenter_aCenter"  v-if='is_vip==1'>
			<view class="allPrice dFlex jAround_aCenter">
				<view><text>{{pay_amount}}元</text></view>
			</view>
			<view class="subBtn" @tap='createOrder1'>{{button_name}}</view>
		</view>
		<view class="total dFlex flexDirection jCenter_aCenter" v-if='is_vip==2'>
			<view class="allPrice dFlex jAround_aCenter">
				<view><text>{{point}}</text>积分 + 运费￥<text>{{pay_amount?(parseFloat(pay_amount - gold).toFixed(2) > 0 ? parseFloat(pay_amount - gold).toFixed(2) : '0.00') :'0.00'}}</text></view>
			</view>
			<view class="subBtn" @tap='createOrder'>确认下单</view>
		</view>
		<my-datetime ref="dateTime1" :titleShow="false" :shownum="time_num" @ok="timeOk"></my-datetime>
		<!-- 优惠券 -->
		<view class='zz dFlex jEnd_aCenter flexDirection' v-if="cpFlag">
			<view class="coupon">
				<view class="titles dFlex jBetween_aCenter">
					<view class="closeIcon imgPublic"></view>
					<view class="tit">可用优惠券</view>
					<view class="closeIcon imgPublic" @tap.stop='cpFlag = false'>
						<image src="../static/images/closeIcon.png" mode="widthFix"></image>
					</view>
				</view>
				<view class="list">
					<view class="quanOne dFlex jBetween_aStart" v-for="(item,index) in coupon" :key='index' @tap.stop='selCoupon(index)'>
						<view class="quanCount dFlex jCenter_aCenter">
							<view v-if="item.user_type == '1'">￥<text>{{item.amount}}</text></view>
							<view v-if="item.user_type == '2'"><text>{{item.zhekou}}折</text></view>
						</view>
						<view class="quanInfo dFlex jBetween_aCenter">
							<view class="info">
								<view class="quanName dFlex jBetween_aCenter">
									<text>{{item.name}}</text>
								</view>
								<view class="suit">适用于：订单抵扣</view>
								<view class="time">有效期：{{item.stop_time}}</view>
							</view>
							<view class="statusIcon imgPublic">
								<image v-if="!item.sel" src="https://wx.gdxixiashi.com/public/images/car/weixuan@2x.png" mode="widthFix"></image>
								<image v-if="item.sel" src="https://wx.gdxixiashi.com/public/images/car/yixuan@2x.png" mode="widthFix"></image>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<!-- 密码输入框 -->
		<view class="zz dFlex jCenter_aCenter" v-if="payFlag">
			<view class="payPwd">
				<view class="titles dFlex jBetween_aCenter">
					<view class="closeIcon imgPublic"></view>
					<view class="tit">请输入支付密码</view>
					<view class="closeIcon imgPublic" @tap.stop='closePay'>
						<image src="../static/images/closeIcon.png" mode="widthFix"></image>
					</view>
				</view>
				<view class="content">
					<text>订单金额</text>
					<view class="price">￥ 138.5</view>
				</view>
				<view class="way dFlex jBetween_aCenter">
					<text>支付方式</text>
					<view class="way_val">
						<text class="count">余额￥200</text>
						<text>微信支付</text>
					</view>
				</view>
				<view class='password-input-box'>
					<view class='input' @tap='getFocus'>
						<view v-for="(item,index) in Length" :key="index" class='input-content'>
							<input :value="pwd.length>=index+1?pwd[index]:''" disabled :password='ispassword' @tap='Tap'></input>
						</view>
					</view>
					<input type="text" v-if="focus" name="password" :password="true" class='password-input' :maxlength="Length" :focus="true" @input="password_input"></input>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import uniDatetimePicker from '@/components/uni-datetime-picker/uni-datetime-picker.vue';
	// import myDatetime from '@/components/my-datetime/my-datetime';
	export default {
		components: {
			// 'my-datetime': myDatetime,
			"uni-datetime-picker":uniDatetimePicker,
		},
		data() {
			return {
				datetimeString:'',
				
				userData:{},
				// 时间选择器
				startTime:'',
				time_num: 3,
				time: '',
				// 密码输入框
				payFlag:false,
				focus: false,
				Length: 6, //输入框个数  
				isFocus: true, //聚焦  
				pwd: "", //输入的内容  
				ispassword: true, //是否密文显示 true为密文， false为明文。
 
				cleanWay: '快递',
				
				// 当前剩余洗护金金额
				useGold:false,
				showGold:'0.00',
				gold:'',
				// 收货地址
				address:{},
				// 展示的商品列表
				shopList:[],
				// 会员优惠金额
				vipPrice:0,
				
				status:'',// 1 单商品结算 2购物车结算
				// 商品页传递 规格id和数量
				specsId:'',
				num:1,
				// 购物车页结算
				cartIds:'',
				
				dataOrderType:'1',//订单结算查询的类型
				// 清洗方式
				order_type:'1',// 1快递2自提
				service_amount1:'',//拆装清洗 拆装费用
				service_amount2:'',//拆装清洗 物流费用
				// 备注
				leave_word:'',
				// 数量是否修改了
				countFlag:false,
				// 实际支付金额
				pay_amount:"0.00",
				point:'0',
				old_payAmount:'',
				// 商品总金额
				total:'',
				// 可用优惠券列表
				cpFlag:false,
				coupon:[],
				selCp:{},//选择的优惠券
				
				order_content:'',//订单说明
				is_vip:2,
				is_show_pay:2,
				button_name:'确认下单'
			};
		},
		onLoad(e){
			this.status = e.status;
			this.specsId = e.status == '1'?e.specsId:'';
			this.num = e.status == '1'?e.num:1;
			this.cartIds = e.status == '2'?e.cartIds:'';
			this.initData();
		},
		onShow() {
			this.startTime = this.tool.timestampToTime(new Date(new Date().toLocaleDateString()).getTime() + 86400000);
			if(uni.getStorageSync('userId')){
				this.initUser();
			}
		},
		onShareAppMessage() {
			return{
				title:'洗匣士~您的家居窗帘清洗助手',
				path:'/pages/home?spreadId=' + (uni.getStorageSync('userId')?uni.getStorageSync('userId'):''),
				imageUrl:getApp().globalData.imgDomain+'public/logo.png',
				desc:'手机下单 | 专员取送 | 生态环保 | 轻奢洗护',
			}
		},
		onShareTimeline() {
			return{
				title:'洗匣士~您的家居窗帘清洗助手',
				path:'/pages/home?spreadId=' + (uni.getStorageSync('userId')?uni.getStorageSync('userId'):''),
				imageUrl:getApp().globalData.imgDomain+'public/logo.png',
				desc:'手机下单 | 专员取送 | 生态环保 | 轻奢洗护',
			}
		},
		methods: {
			// 页面数据
			initData(){
				let url = this.status == '1'?'PointProduct/comfirmOrderBuy':'PointCart/comfirmCartOrder';
				let data = this.status == '1'?{
					memberId:uni.getStorageSync('userId'),
					specsId:this.specsId,
					num:this.num,
					recordId:"",
					order_type:this.order_type,
				}:{
					memberId:uni.getStorageSync('userId'),
					cartIds:this.cartIds,
					order_type:this.order_type,
				};
				this.vipPrice = 0;
				
				this.tool.getData(url,data).then(res=>{
					console.log(res);
					if(res){
						this.button_name=res.button_name;
						this.address = res.address;
						this.is_show_pay = res.is_show_pay;
						this.is_vip = res.is_vip;
						if(this.status == '1'){
							this.vipPrice = res.product.sell_price * res.product.num - res.product.vip_price * res.product.num;
							res.product.list_img = getApp().globalData.imgDomain + res.product.list_img;
							if(!this.countFlag){
								this.shopList = [];
							}
							this.shopList.push(res.product);
							this.dataOrderType = res.order_type;
							this.num = res.product.num;
						}else{
							this.shopList = [];
							res.list.map((item,index)=>{
								this.vipPrice = this.vipPrice + (item.sell_price * item.num - item.vip_price * item.num);
								item.list_img = getApp().globalData.imgDomain + item.list_img;
								this.shopList.push(item);
							})
						}
						if(res.coupon_record.length){
							res.coupon_record.map((item,index)=>{
								item.sel = false;
							})
							this.coupon = res.coupon_record;
						}
						this.service_amount1 = res.service_amount1;
						this.service_amount2 = res.service_amount2;
						this.total = res.total;
						this.pay_amount = res.pay_amount;
						this.old_payAmount = res.pay_amount;
						this.showGold = res.gold;
						this.point = res.point;
						if(this.selCp.recordId){
							if(this.selCp.user_type=='1'){//满减券
								this.pay_amount = this.old_payAmount - this.selCp.amount;
							}else{//折扣券
								this.pay_amount = this.old_payAmount * (this.selCp.zhekou / 10);
							}
						}
						this.order_content = res.order_content;
					}
				}).catch(err=>{
					console.log(err);
				})
			},
			// 计算洗护券
			calcXH(e){
				if(this.showGold > this.pay_amount && e.detail.value > this.pay_amount){
					uni.showToast({
						title:"该订单最多使用"+this.pay_amount+'元洗护券',
						icon:"none"
					})
					this.gold = this.pay_amount;
				}
			},
			// 是否使用洗护券
			change_useGold(e){
				this.useGold = e.detail.value;
				if(e.detail.value){
					if(this.showGold >= this.pay_amount){
						this.gold = this.pay_amount;
					}else{
						this.gold = this.showGold;
					}
				}else{
					this.gold = '';;
				}
			},
			// 选择优惠券
			selCoupon(idx){
				let line = this.coupon[idx];
				this.coupon.map((item,index)=>{
					item.sel = false;
				})
				if(line.user_type=='1'){//满减券
					this.pay_amount = this.old_payAmount - line.amount;
				}else{//折扣券
					// this.pay_amount = this.old_payAmount - (this.old_payAmount * (line.zhekou / 10));
					this.pay_amount = this.old_payAmount * (line.zhekou / 10);
				}
				line.sel = true;
				this.cpFlag = false;
				this.selCp = line;
			},
			createOrder1(){
				console.log(this.button_name);
				if(this.button_name=='确认下单'){
					uni.showModal({
						title:'下单提醒',
						content:'您购买的商品不支持退款，是否购买',
						success:(op)=>{
							if(op.confirm){
								this.createOrder()
							}else{
								return;
							}
						},
						fail:(err)=>{
							console.log(err);
						}
					})
				}else{
					uni.showModal({
						title:'下单提醒',
						content:'开通店中店不支持退款，是否开通',
						success:(op)=>{
							if(op.confirm){
								this.createOrder()
							}else{
								return;
							}
						},
						fail:(err)=>{
							console.log(err);
						}
					})
				}
				
			},
			// 创建订单
			createOrder(){
				if(!this.address.addressId){
					uni.showToast({
						title:'请选择一个上门地址',
						icon:'none'
					})
					
				}
				
				let url = this.status == '1'?'PointProduct/addOrderBuy':'PointCart/addCartOrder';
				let data = this.status == '1'?{
					memberId:uni.getStorageSync('userId'),
					specsId:this.specsId,
					num:this.num,
					leave_word:this.leave_word,
					addressId:this.address.addressId,
					order_type:this.order_type,
					// gold:this.gold,
					// order_time:this.time,
					// recordId:this.selCp.recordId?this.selCp.recordId:'',
				}:{
					memberId:uni.getStorageSync('userId'),
					addressId:this.address.addressId,
					cartIds:this.cartIds,
					leave_word:this.leave_word,
				    order_type:this.order_type,
					// gold:this.gold,
					// order_time:this.time,
					// recordId:this.selCp.recordId?this.selCp.recordId:'',
				};
				this.tool.getData(url,data).then(res=>{
					console.log(res);
					if(res.orderId && res.is_pay == '1'){
						var itemList2 = [];
						if(this.is_show_pay == 1){
							itemList2=['微信支付','支付宝支付'];
						}else{
							itemList2=["余额"];
						}
						
						uni.showActionSheet({
							// #ifdef MP-WEIXIN
							itemList :['微信支付'],
							// #endif
							
							// #ifdef APP-PLUS
							itemList :itemList2,
							// #endif
							success: (op) => {
								let pay_method = 1;
								if(op.tapIndex == 0){
									// #ifdef MP-WEIXIN
									pay_method = 2;	
									// #endif
									// #ifdef APP-PLUS
									if(this.is_show_pay == 1){
										pay_method = 4;
									}else{
										pay_method = 1;
									}
									// #endif
								}else if(op.tapIndex == 1){
									pay_method = 3;
								}
								this.tool.getData('PointOrder/orderPay',{
									orderId:res.orderId,
									pay_method:pay_method,
								}).then(res2=>{
									if(res2){
										if(pay_method == 2 || pay_method == 4){
											uni.requestPayment({
												provider:'wxpay',
												timeStamp:res2.weixin.timeStamp,
												nonceStr:res2.weixin.nonceStr,
												package:res2.weixin.package,
												signType:res2.weixin.signType,
												paySign:res2.weixin.paySign,
												success: () => {
													uni.showToast({
														title:'订单支付成功',
														icon:"success"
													})
													if(this.button_name=='确认下单'){
														uni.navigateTo({
															url:'../person/storeapply'
														})
													}else{
														setTimeout(()=>{
															uni.navigateBack({
																delta:1
															})
														},1650)
													}
													
												},
												fail:(err)=>{
													console.log(err);
													uni.showToast({
														title:'订单支付失败',
														icon:"none"
													})
												}
											})
										}else if(pay_method == 1){
											uni.showToast({
												title:'订单支付成功',
												icon:"success"
											})
											if(this.button_name=='确认下单'){
												uni.navigateTo({
													url:'../person/storeapply'
												})
											}else{
												setTimeout(()=>{
													uni.navigateBack({
														delta:1
													})
												},1650)
											}
										}else if(pay_method == 3){
											uni.requestPayment({
												provider:'alipay',
												orderInfo:res2.alipay,
												success: () => {
													uni.showToast({
														title:'订单支付成功',
														icon:"success"
													})
													if(this.button_name=='确认下单'){
														uni.navigateTo({
															url:'../person/storeapply'
														})
													}else{
														setTimeout(()=>{
															uni.navigateBack({
																delta:1
															})
														},1650)
													}
												},
												fail:(err)=>{
													console.log(err);
													uni.showToast({
														title:'订单支付失败',
														icon:"none"
													})
												}
											})
										}
									}
								}).catch(err=>{
									console.log(err);
								})
							},
							fail:(err)=>{
								
							},
						})
					}else if(res.orderId && res.is_pay == '2'){
						uni.showToast({
							title:'订单支付成功',
							icon:"success"
						})
						setTimeout(()=>{
							uni.navigateBack({
								delta:1
							})
						},1650)
					}
				}).catch(err=>{
					console.log(err);
				})
			},
			// 用户信息
			initUser(){
				this.tool.getUserInfo().then(res=>{
					// console.log(res);
					if(res){
						this.userData = res;
					}
				}).catch(err=>{
					console.log(err);
				})
			},
			// 选择收货地址
			selAdd(){
				uni.navigateTo({
					url:'/kind/addList'
				})
			},
			// 修改选择项
			change_sel(idx) {
				let list = ['快递', '自提'];
				uni.showActionSheet({
					itemList: list,
					success: (tap) => {
						if (idx == '1') {
							this.cleanWay = ['快递', '自提'][tap.tapIndex];
							this.order_type = tap.tapIndex+1;
							this.initData();
						}
					}
				})
			}, 
			// 输入数量
			setCount(e,idx){
				if(this.status == '1'){
					this.num = e.detail.value;
					/* if(e.detail.value){
						this.num = e.detail.value;
					}else{
						this.num = '';
					} */
					this.initData();
				}else{
					let line = this.shopList[idx];
					if(e.detail.value){
						this.tool.getData('Cart/changeCartNum',{
							type:e.detail.value > line.num?'1':'2',
							num:e.detail.value,
							cartId:line.cartId,
						}).then(res=>{
							if(res){
								this.initData();
							}
						}).catch(err=>{
							console.log(err);
						})
					}
					/* if(e.detail.value){
						line.num = e.detail.value;
					}else{
						line.num = '';
					} */
				}
			},
			// 加减商品数量
			jian(idx){
				let line = this.shopList[idx];
				if(line.num > 1){
					if(this.status == '1'){
						this.num--;
						this.initData();
					}else{
						line.num--;
						this.tool.getData('Cart/changeCartNum',{
							type:'2',
							num:line.num,
							cartId:line.cartId,
						}).then(res=>{
							if(res){
								this.initData();
							}
						}).catch(err=>{
							console.log(err);
						})
					}
				}
			},
			jia(idx){
				let line = this.shopList[idx];
				if(this.status == '1'){
					this.num++;
					this.initData();
				}else{
					line.num++;
					this.tool.getData('Cart/changeCartNum',{
						type:'1',
						num:line.num,
						cartId:line.cartId,
					}).then(res=>{
						if(res){
							this.initData();
						}
					}).catch(err=>{
						console.log(err);
					})
				}
			},
			// 关闭支付
			closePay(){
				this.focus = false;
				this.payFlag = false;
			},
			// 密码输入框
			password_input(e) {
				this.pwd = e.detail.value
			},
			Tap() {
				this.isFocus = true;
			},
			getFocus() {
				this.focus = !this.focus;
			},
			// 时间选择器
			selTime(key, num) {
				this.dateKey = key
				this.time_num = num || 3
				this.$refs.dateTime1.open();
			},
			// 关闭弹窗
			timeOk(str, obj) {
				// console.log(str, obj);
				this.time = str;
				this[this.dateKey] = str || '';
			}
		}
	}
</script>

<style lang="scss">
	.beforeOrder {
		width: 100%;
		padding: 12px 3%;
		box-sizing: border-box;
		.zz{
			.coupon{
				width:100%;
				overflow: auto;
				max-height: 80%;
				background: white;
				.list{
					width:100%;
					padding: 12px 4%;
					box-sizing: border-box;
					.quanOne{
						width:100%;
						background: white;
						border-radius: 4px;
						box-sizing: border-box;
						margin-bottom: 12px;
						overflow: hidden;
						.quanCount{
							width: 25%;
							height: 100%;
							color: white; 
							height: 105px;
							font-size: 12px;
							font-weight: bold;
							background: linear-gradient(#1664ff 0%, #609ff8 100%);
							text{
								font-size: 22px;
							}
						}
						.quanInfo{
							flex: 1;
							padding: 12px;
							box-sizing: border-box;
							.info{
								flex: 1;
								.time{
									color: #999999;
									font-size: 12px;
								}
								.suit{
									margin: 10px 0;
									font-size: 12px;
									color: #999999;
								}
								.quanName{
									width: 100%;
									font-size: 15px;
									color: #111111;
									font-weight: bold;
									.use{
										padding: 5px 8px;
										border-radius: 4px;
										color: white;
										background: #1664FF;
										width: max-content;
										font-size: 12px;
									}
								}
							}
							.statusIcon{
								width: 20px;
								height: 20px;
								margin-left: 5px;
							}
						}
					}
					.hui{
						.quanCount{
							background: #CCCCCC;
						}
					}
				}
				.titles{
					width:100%;
					padding: 15px 3.2%;
					box-sizing: border-box;
					color: #000000;
					font-size: 15px;
					.closeIcon{
						width: 14px;
						height: 14px;
					}
				}
			}
			.payPwd{
				width: 88%;
				background: white;
				padding: 0 20px 20px;
				box-sizing: border-box;
				border-radius: 8px;
				.way{
					width: 100%;
					padding: 14px 0;
					color: #999999;
					.way_val{
						color: #333333;
						font-weight: bold;
						font-size: 16px;
						.count{
							font-size: 14px;
							color: #999999;
							font-weight: 400;
							margin-right: 6px;
						}
					}
				}
				.content{
					width: 100%;
					text-align: center;
					color: #000000;
					padding: 10px 0;
					border-bottom: 1px solid #CCCCCC;
					.price{
						font-size: 30px;
						font-weight: bold;
						margin-top: 4px;
					}
				}
				.titles{
					width:100%;
					padding: 15px 0;
					color: #000000;
					font-size: 15px;
					.closeIcon{
						width: 14px;
						height: 14px;
					}
				}
				.password-input-box {
					width: 100%;
					display: flex;
					flex-direction: row;
					align-items: center;
					justify-content: center;
					box-sizing: border-box;
					height:40px;
					position:relative;
					.input {
						height: 40px;
						width: 100%;
						// border: 1px solid #BBB;
						display: flex;
						align-items: center;
						justify-content: center;
						text-align: center;
						background: white;
						border-radius: 4px;
						background: #E0E0E0;
						.input-content {
							display: flex;
							align-items: center;
							justify-content: center;
						}
					}
					.input>view:nth-child(6) {
						border-right: none;
					}
					.input>view {
						height: 100%;
						width: 16.6%;
						border-right: 4px solid #fff;
					}
					.password-input {
						width:0;
						height:0;
					}
				}
			}
		}
		.tips{
			width:100%;
			margin:10px 0;
			font-size:12px;
			color: #F95822;
		}
		.total {
			width: 100%;
			padding: 0 3% 12px;
			box-sizing: border-box;

			.subBtn {
				width: 100%;
				color: white;
				text-align: center;
				padding: 12px 0;
				background: linear-gradient(0deg, #609ff8 0%, #1664ff 100%);
				border-radius: 6px;
				margin-top: 6px;
			}
			.vipPrice{
				margin:6px 0;
				text{
					font-weight: bold;
					color:red;
					font-size: 16px;
				}
			}
			.allPrice {
				font-size: 12px;
				margin-bottom:10px;
				text {
					font-size: 18px;
					font-weight: bold;
					color:red;
				}
			}
		}

		.shops {
			width: 100%;
			background: white;
			padding: 0 12px;
			margin-bottom: 12px;
			box-sizing: border-box;

			.shopOne {
				width: 100%;
				padding: 15px 0;
				border-bottom: 1px solid #eeeeee;

				.info {
					flex: 1;

					.shopName {
						font-size: 16px;
						font-weight: bold;
					}
					.vip{
						font-size: 12px;
						color: red;
					}
					.sku {
						font-size: 12px;
						color: #999999;
						margin: 5px 0;
						.price{
							color: #F95822;
							text{
								font-size: 14px;
								font-weight: bold;
							}
						}
					}

					.other {
						width: 100%;
						font-size: 14px;
						color: #F95822;
						.price{
							font-size: 12px;
							text{
								font-size: 14px;
								font-weight: bold;
							}
						}
						.count {
							width: auto;

							.smallIpt {
								width: 60rpx;
								height: 60rpx;
								margin: 0 12rpx;

								input {
									width: 60rpx;
									height: 60rpx;
									text-align: center;
									line-height: 60rpx;
									color: #999999;
									font-size: 14px;
								}
							}

							.smallBtn {
								width: 60rpx;
								height: 60rpx;

								image {
									width: 60rpx;
									height: 60rpx;
								}
							}
						}
					}
				}

				.shopImg {
					width: 78px;
					max-height: 78px;
					overflow: hidden;
					margin-right: 16px;
				}
			}

			.shopOne:last-child {
				border: none;
			}
		}

		.part {
			width: 100%;
			background: white;
			padding: 0 12px;
			box-sizing: border-box;
			border-radius: 5px;
			margin-bottom: 12px;

			.line {
				width: 100%;
				padding: 12px 0;
				box-sizing: border-box;
				border-bottom: 1px solid #E8E8E8;

				.lineTit {
					max-width:40%;
					min-width:25%;
				}

				.lineVal {
					flex: 1;
					color: #333333;

					.showVal {
						flex: 1;
						text-align: right;

						input {
							width: 100%;
							text-align: right;
						}
					}

					.rightIcon {
						width: 15px;
						margin-left: 8px;
					}
				}
			}

			.line:last-child {
				border: none;
			}

			.appoint {
				width: 100%;
				padding: 12px 0;
				font-size: 13px;
			}

			.address {
				width: 100%;
				padding: 14px 0;
				// border-bottom: 1px solid #D0D0D0;
				.user {
					font-size: 12px;

					text {
						margin-right: 6px;
					}
				}

				.bigAdd {
					font-size: 12px;
					color: #999999;

					.moren {
						background: #1664FF;
						color: white;
						padding: 2px 4px;
						border-radius: 2px;
						margin-right: 6px;
					}
				}

				.smallAdd {
					margin: 12px 0 10px;
					font-size: 17px;
					color: #333333;
					font-weight: bold;
				}
			}
		}
	}
</style>